<template>
  <div class="form-group" >
    <label :for="id" :class="labelClass" :style="finalLabelStype">{{ title }}：</label>
    <a-tooltip :overlayStyle="{minWidth:'min-content'}" overlayClassName="my-tooltip" placement="topLeft">
      <template slot="title" v-if="showTooltip">
        <slot name="tooltip"></slot>
      </template>
      <div :class="rightClass" :style="rightStyle" :title="value" class="show-text">
        {{value}}
      </div>
    </a-tooltip>
    
  </div>
</template>

<script>
import formAttr from "@/mixins/form/form-attr";

const defaultLabelStype =
  "font-weight: normal;justify-content: flex-end;padding-left: 5px;text-align: right;width:110px;";
export default {
  name: "FormShow",
  mixins: [formAttr],
  props: {
      showTooltip:{
      type: Boolean,
      default:false
    },
  },
  mounted(){
  },
  computed: {
    finalLabelStype: function() {
      return this.labelStyle || defaultLabelStype;
    },
  },
  methods: {
  
  }
};
</script>
<style lang="less" scoped>
.show-text{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
</style>

